<template>
  <div class="main-box">
    <!--******底部栏需要变色******-->
    <!--测试结果（未完成）-->
    <div class="mocks-result-main" v-if="status == 1">
      <div class="r-incomplete">
        <p class="r-i-p1"></p>
        <p class="r-i-p2"></p>
        <p class="r-i-p3"><span class="color-red">未出分</span></p>
        <p class="r-i-p4">老师正在阅卷，请耐心等待!</p>
        <span class="layui-btn layui-btn-mocks icon-lg layui-btn-disabled">查看详情</span>
      </div>
    </div>
    <!--测试结果（已完成）-->
    <div class="mocks-result-main" v-if="status == 2">
      <div class="r-complete">
        <p class="r-c-p1"></p>
        <div class="r-c-table">
          <div class="r-hd">恭喜您已完成试卷</div>
          <div class="r-bd">
            <div class="r-title">分数</div>
            <div class="r-score">
              <span class="color-red">{{score}}</span>
            </div>
          </div>
        </div>
        <a :href="'#/details/' + paperId" class="layui-btn layui-btn-mocks icon-lg">查看详情</a>
      </div>
    </div>
  </div>
</template>

<script>
  import { mapState, mapActions } from 'vuex';
  export default {
    name: "MocksResult",
    data () {
      return {
        status: -1,
        score: 0
      };
    },
    created () {
      let paperId = this.$route.params.paperId;
      this.status = this.$route.params.status;
      this.score = this.$route.params.score;
      this.updatePaperId(paperId);
    },
    beforeRouteLeave (to, from, next) {
      if (to.name == 'MocksDetails') {
        next();
      } else {
        window.location.replace('#' + from.path);
      }
    },
    computed: {
      ...mapState([
        'paperId'
      ]),
    },
    methods: {
      ...mapActions([
        'updatePaperId'
      ]),
    }
  }
</script>

<style scoped>

</style>
